<template>
  <div class="dynamicContainer helpContainer">
    <!-- 头部 -->
    <van-nav-bar
      title="帮助反馈"
      left-arrow
      @click-left="onClickLeft"
      class="navheadrt"
    >
    </van-nav-bar>
    <div class="content">
      <van-collapse v-model="activeNames" accordion v-if="list.length>0">
        <van-collapse-item
          :name="index"
          v-for="(item, index) in list"
          :key="index"
          :title="item.Question"
          ><p class="text">{{ item.Answer }}</p></van-collapse-item
        >
      </van-collapse>
        <div v-else class="nodata"><img :src="nodata" alt="" /></div>
    </div>
  </div>
</template>
<script>

import { GetHelp } from "@/api/api";
export default {
  data() {
    return {
         nodata: require("./imgs/nodata.png"),
      activeNames: [1],
      list: [
       
      ],
    };
  },
    mounted() {
    this.init();
  },
  methods: {
     // 返回按钮
    onClickLeft() {
      this.$router.go(-1);
    },
    init() {
       this.$toast.loading({
        mask: true,
        message: "加载中...",
        className: "my-toast",
      });
      this.Request(GetHelp()).then((res) => {
        if (res.StatusCode == "200") {
           this.$toast.clear();
        this.list=res.Detiel
        } else {
          this.$message({
            type: "error",
            message: res.Message,
            center: "true",
          });
        }
      });
    },
  },

};
</script>
<style lang="stylus" scoped>
@import './common/common';
@import '~@/assets/css/resetVant.css';
.nodata {
  width: 100%;
  height: 100%;
  margin: 100px 0;
  text-align: center;

  img {
    width: 60%;
  }
}
$font-size-title = 36px;

.helpContainer {
  background: #fff;

  /deep/.van-cell__right-icon {
    font-size: 36px !important;
  }

  /deep/.van-cell {
    height: 90px;
    line-height: 90px;
    font-size: 28px;
  }

  /deep/.van-cell__right-icon {
    line-height: 90px !important;
  }

  .text {
    font-size: 30px !important;
    font-family: Microsoft YaHei;
    font-weight: 300;
    color: #000;
  }

  .pad20 {
    padding: 10px 0;
  }

  .qbg {
    padding: 0 10px;
    height: 40px;
    line-height: 30px;
    font-size: 20px;
    font-family: iekie;
    font-weight: normal;
    color: #FFFFFF;
    background: url('./imgs/qe.png') no-repeat;
    background-size: 100% 100%;
    margin-right: 30px;
  }
}

.navheadrt {
  /deep/ .van-nav-bar__title, /deep/.van-icon {
    color: #fff !important;
  }
}

.van-nav-bar {
  background: #699FFF;
  color: #fff !important;
  margin-bottom: 30px;
  height: 88px;
}

.van-nav-bar__title, .van-nav-bar__left, .van-nav-bar__right {
  color: #fff;
}

.van-icon-arrow-left {
  color: #fff;
  font-size: $font-size-title;
}

.content {
  width: 100%;
  padding: 0 30px;
  box-sizing: border-box;
}
</style>